'use strict';

new Vue({
  el: '#root',

  data: {
    swiperIst: null,
    selectImage: 1,
    swiperOption: {
      onClick: function onClick(s, e) {
        return console.log(s, e);
      },
      slidesPerView: 4,
      spaceBetween: 10,
      slidesPerGroup: 1,
      loop: true,
      loopFillGroupWithBlank: true,
      pagination: {
        el: '.swiper-pagination',
        clickable: true
      },
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev'
      }
    }
  },

  mounted: function mounted() {
    this.swiperIst = new Swiper('.swiper-container', {
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev'
      },
      onClick: function onClick(params) {
        console.log(params);
      },
      slidesPerView: 4,
      spaceBetween: 10,
      slidesPerGroup: 1
      // loop: true,
      // loopFillGroupWithBlank: true,
    });
  },


  methods: {
    onClickPrev: function onClickPrev() {
      this.swiperIst.slidePrev();
    },
    onClickNext: function onClickNext() {
      this.swiperIst.slideNext();
    }
  }
});